@import url('reset.css');
/* General Demo Style */
@font-face {
    font-family: 'BebasNeueRegular';
    src: url('fonts/BebasNeue-webfont.eot');
    src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/BebasNeue-webfont.woff') format('woff'),
         url('fonts/BebasNeue-webfont.ttf') format('truetype'),
         url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

a{text-decoration:none;outline:hidden}
img{outline:none;}
#cuahang{width:100%;height:100%;position:absolute;top:100px;left:0}
#products{z-index:999999}
*{margin:0;padding:0}
.wrapper{width:100%;height:100%;float:left;}
.left{position:fixed;width:10%;height:100%;left:0;top:0;}
.right{position:fixed;width:10%;height:100%;right:0;top:0;}
.empty{width:100%;height:50px;float:left;}
.displaynone{display:none}
.open>a{position:fixed;top:40%;left:42%;color:#ddd;font-size:100px;text-shadow:0px 3px 6px #000;
	transform: skew(-10deg);
    -moz-transform: skew(-10deg);
    -webkit-transform: skew(-10deg);
    -o-transform: skew(-10deg);
    -ms-transform: skew(-10deg);
	-webkit-transition: transform 1.4s ease-in-out;
	-moz-transition: transform 1.4s ease-in-out;
	-o-transition: transform 1.4s ease-in-out;
	-ms-transition: transform 1.4s ease-in-out;
	transition: transform 1.4s ease-in-out;}
.open>a:hover{
	transform:scale(3) skew(-170deg);-moz-transform:scale(3) skew(-170deg);-webkit-transform:scale(3) skew(-170deg);-ms-transform:scale(3) skew(-170deg);-o-transform:scale(3) skew(-170deg);outline:0;
	-webkit-transition: transform 1.4s ease-in-out;
	-moz-transition: transform 1.4s ease-in-out;
	-o-transition: transform 1.4s ease-in-out;
	-ms-transition: transform 1.4s ease-in-out;
	transition: transform 1.4s ease-in-out;
}
.thongtintaikhoan{
	position:absolute;
	width:100%;
	top:0;
	left:0;
	height:200px;
}
.banner{
	position:absolute;
	left:-60px;
	bottom:130px;
	z-index:3;
	transform:rotate(-90deg);
	-ms-transform:rotate(-90deg); /* IE 9 */
	-webkit-transform:rotate(-90deg); /* Opera, Chrome, and Safari */
}
.banner>a{
	font-size:70px;
	color:#a00;
	text-shadow:0px 2px 5px #000;
	-webkit-transition: color 2s ease-in-out;
	-moz-transition: color 2s ease-in-out;
	-o-transition: color 2s ease-in-out;
	-ms-transition: color 2s ease-in-out;
	transition: color 2s ease-in-out;
}
.banner>a:hover{
	text-shadow:0px 2px 4px #000;
	color:#f00;
	-webkit-transition: color 2s ease-in-out;
	-moz-transition: color 2s ease-in-out;
	-o-transition: color 2s ease-in-out;
	-ms-transition: color 2s ease-in-out;
	transition: color 2s ease-in-out;
}

.top{background:rgba(aa,00,0,0.9);position:fixed;width:100%;height:5%;left:0;top:0;}
.bottom{position:fixed;width:100%;height:35px;left:0;bottom:0;z-index:99999;
	background-image: -o-linear-gradient(to bottom, #f00 0%, #700 100%);
	background-image: -moz-linear-gradient(to bottom, #f00 0%, #700 100%);
	background-image: -webkit-linear-gradient(to bottom, #f00 0%, #700 100%);
	background-image: -ms-linear-gradient(to bottom,#f00 0%, #700 100%);
	background-image: linear-gradient(to bottom, #f00 0%, #700 100%);
}
.center{position:fixed;background:rgba(17,17,22,0.2);width:80%;height:90%;left:10%;top:5%;box-shadow:0px 1px 5px #000;text-align:right;}
.bottom-center{position:relative;width:80%;text-align:left;padding:10px 0 0 15px;}
.bottom-center>a{color:#bbb;text-shadow:0px 2px 3px #000;font-size:16px;padding:5px 8px}
.bottom-center>a:hover{text-decoration:underline;color:#eee;text-shadow:0px 1px 1px #000;}
.logo{padding:40px 30px;}
.logo>a{background:rgba(17,17,22,0.5);padding:20px 60px;font-size:30px;color:#e00;text-shadow:0px 1px 8px #000;box-shadow:0px 1px 5px #000;}
.logo>a:hover{background:rgba(17,17,22,0.7);color:#f00}
p.address{padding:0px 50px;font-size:18px;color:orange;text-shadow:0px 1px 8px #000;}
p.phone{padding:0px 50px;font-size:18px;color:orange;text-shadow:0px 1px 8px #000;}
.zoom{ 	
	-webkit-transition: transform 1.4s ease-in-out;
	-moz-transition: transform 1.4s ease-in-out;
	-o-transition: transform 1.4s ease-in-out;
	-ms-transition: transform 1.4s ease-in-out;
	transition: transform 1.4s ease-in-out;
}
.zoom:hover{transform:scale(1) rotate(0deg);-moz-transform:scale(1) rotate(0deg);-webkit-transform:scale(1) rotate(0deg);
	-webkit-transition: transform 1.4s ease-in-out;
	-moz-transition: transform 1.4s ease-in-out;
	-o-transition: transform 1.4s ease-in-out;
	-ms-transition: transform 1.4s ease-in-out;
	transition: transform 1.4s ease-in-out;
	box-shadow:0px 6px 14px #000;
}

.zoom:hover a{
	padding-left:0px !important;
}


.bannerwebsite>a{position:absolute;top:358px;left:350px;font-size:15px;color:#a00;text-shadow:0px 5px 10px #000;opacity:0.7;
transform: rotate(15.6deg) ;
    webkit-transform:  rotate(15.6deg) ;
    -moz-transform:  rotate(15.6deg) ;
    -o-transform:  rotate(15.6deg) ;
    -ms-transform:  rotate(15.6deg) ;
 }
.bannerwebsite>a:hover{color:#f00;}

/*----------------------------------  cuahang ----------------------------------------*/
.showroom{position:relative;width:1000px;text-align:left;height:auto;padding-top:180px}
.background-img>img{position:absolute;top:0;left:0;width:100%;height:100%;}

.head{position:fixed;height:150px;width:100%;top:0;left:0;z-index:9999;
	background-image: -o-linear-gradient(to bottom,#a00 0%, rgba(17,17,22,0.4) 100%);
	background-image: -moz-linear-gradient(to bottom,#a00 0%,rgba(17,17,22,0.4) 100%);
	background-image: -webkit-linear-gradient(to bottom,#a00 0%,rgba(17,17,22,0.4) 100%);
	background-image: -ms-linear-gradient(to bottom,#a00 0%,rgba(17,17,22,0.4) 100%);
	background-image: linear-gradient(to bottom,#a00 0%,rgba(17,17,22,0.4) 100%); 
	box-shadow:0px 3px 5px #000;
}
.head>center>.menubar{width:1000px;padding:0px 10px;text-align:left;}
.head>center>.menubar>a{font-size:14px;color:#f00;margin-left:20px;text-shadow:0px 2px 5px #000;}
.head>center>.menubar>a:hover{color:orange}
span>.back{position:fixed;width:80px;color:#ccc;font-size:24px;left:15%;bottom:100px;z-index:99990;text-shadow:0px 1px 3px #000;font-weight:300;}
span>.back>marquee:hover{color:#fff;font-size:26px;
		-webkit-transition: color 1.4s ease-in-out;
	-moz-transition: color 1.4s ease-in-out;
	-o-transition: color 1.4s ease-in-out;
	-ms-transition: color 1.4s ease-in-out;
	transition: color 1.4s ease-in-out;
}
.end{position:fixed;height:90px;width:100%;bottom:0;left:0;z-index:99;
	background-image: -o-linear-gradient(to top,#a00 0%, rgba(17,17,22,0.4) 100%);
	background-image: -moz-linear-gradient(to top,#a00 0%,rgba(17,17,22,0.4) 100%);
	background-image: -webkit-linear-gradient(to top,#a00 0%,rgba(17,17,22,0.4) 100%);
	background-image: -ms-linear-gradient(to top,#a00 0%,rgba(17,17,22,0.4) 100%);
	background-image: linear-gradient(to top,#a00 0%,rgba(17,17,22,0.4) 100%); 
	box-shadow:0px 3px 5px 5px #000;
}
.end>center>.menubar{width:1000px;text-align:left;}
.end>center>.menubar>span{float:right}
.end>center>.menubar>span>div{box-shadow:0px 1px 4px #000;}
.information{position:relative;width:1000px;}
.logo-shopping{padding-left:50px;}
.logo-shopping>a{position:relative;clear:both;font-size:70px;text-shadow:0px 3px 5px #000;color:#f00;text-align:center;top:30px;left:0px;
-webkit-transition: color 2s ease-in-out;
	-moz-transition: color 2s ease-in-out;
	-o-transition: color 2s ease-in-out;
	-ms-transition: color 2s ease-in-out;
	transition: color 2s ease-in-out;
}
.logo-shopping>a:hover{color:#eee;
-webkit-transition: color 2s ease-in-out;
	-moz-transition: color 2s ease-in-out;
	-o-transition: color 2s ease-in-out;
	-ms-transition: color 2s ease-in-out;
	transition: color 2s ease-in-out;
}
.shopname{position:absolute;clear:both;font-size:30px;text-shadow:0px 3px 5px #000;color:orange;text-align:center;top:160px;padding-left:60px;
		-webkit-transition: color 2s ease-in-out;
	-moz-transition: color 2s ease-in-out;
	-o-transition: color 2s ease-in-out;
	-ms-transition: color 2s ease-in-out;
	transition: color 2s ease-in-out;
}
.shopname:hover{
	
	color:#af4;
	text-decoration:underline;
	text-shadow:0px 3px 4px #000;
	-webkit-transition: color 2s ease-in-out;
	-moz-transition: color 2s ease-in-out;
	-o-transition: color 2s ease-in-out;
	-ms-transition: color 2s ease-in-out;
	transition: color 2s ease-in-out;
}
.address-shop{position:absolute;color:#ddd;font-size:18px;text-shadow:0px 3px 5px #000;top:200px;padding-left:60px;text-align:left;}
.mobile-phone{position:absolute;color:#ddd;font-size:18px;text-shadow:0px 3px 5px #000;top:230px;padding-left:60px;text-align:left;}
.avatar-img>img{position:absolute;right:50px;top:50px;z-index:9999999;box-shadow:0px 4px 8px #000;border:8px solid rgba(17,17,22,0.3);border-radius:50%;}

.fb-comments{background:#a00;background-image: -o-linear-gradient(to top,rgba(17,17,22,0.5) 0%,#000 80%);
	background-image: -moz-linear-gradient(to top,rgba(17,17,22,0.5) 0%,#000 80%);
	background-image: -webkit-linear-gradient(to top,rgba(17,17,22,0.5) 0%,#000 80%);
	background-image: -ms-linear-gradient(to top,rgba(17,17,22,0.5) 0%,#000 80%);
	background-image: linear-gradient(to top,rgba(17,17,22,0.5) 0%,#000 80%);
}